<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@page pageEncoding="UTF-8" contentType="text/html;charset=UTF-8"
	import="com.srit.forecast.constant.Constant"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<%@ taglib prefix="srit-tag" uri="/srit-constant-tag"%>
<html>
<head>
<title>City6Hours</title>
<script type="text/javascript"
	src="<c:url value="/resources/js/jquery-1.8.0.min.js" />"></script>
<script type="text/javascript"
	src="<c:url value="/resources/js/jquery-ui-1.10.0.custom.min.js" />"></script>
<link href="<c:url value="/resources/css/forecast.css" />"
	rel="stylesheet" type="text/css">
<link
	href="<c:url value="/resources/css/jquery-ui-1.10.0.custom.css" />"
	rel="stylesheet" type="text/css">
<script type="text/javascript"
	src="<c:url value="/resources/views/initDrag.js" />"></script>
<script type="text/javascript"
	src="<c:url value="/resources/views/city6Hours.js" />"></script>

<script>
	function setTab(m, n) {
		var tli = document.getElementById("menu" + m)
				.getElementsByTagName("li");
		var mli = document.getElementById("main" + m)
				.getElementsByTagName("ul");
		for (i = 0; i < tli.length; i++) {
			tli[i].className = i == n ? "hover" : "";
			mli[i].style.display = i == n ? "block" : "none";
		}
	}

	$(function() {
		$(document).tooltip({
			items : "img, [data-geo], [title]",
			content : function() {
				//	console.log("tooltip")
				var element = $(this);
				if (element.is("[title]")) {
					return element.attr("title");
				}
				if (element.is("img")) {
					return element.attr("alt");
				}
			}
		});
		//初始化拖拽
		initDrag('<c:url value="/drag-view"></c:url>');
		//初始化复制
		initCopy();
		initUTCDate();

		$("#saveBtn").click(function() {
			$("#city6HoursVO").submit();
		})
		$('.ck_table .normal_tr').addClass('odd');
		$('.ck_table .normal_tr:even').addClass('even'); //奇偶变色，添加样式  

	});
</script>
</head>
<body>
	<div class="center">
		<form:form modelAttribute="city6HoursVO" action="/city6Hours-save">
			<p class="title">大城市逐六小时精细化预报</p>
			<div class="left_tb">
				<table width="100%" border="1" id="city6HoursTable"
					class="form_table" style="border-right-width: 0px;">
					<tr>
						<td width="23%" align="center" class="bgcolor"
							style="font-weight: bold; color: #0280CA">发布时次</td>
						<td colspan="7" align="left"><input type="text" size="5"
							name="report.year" />年<input type="text" size="2"
							name="report.month" />月<input type="text" size="2"
							name="report.day" />日<input type="text" size="2"
							name="report.hour" />时</td>
					</tr>
					<tr align="center" class="tb_th">
						<td>预报时段</td>
						<td>天气现象</td>
						<td>最大风力</td>
						<td>风向</td>
						<td>最高</td>
						<td>最低</td>
						<td>降水量</td>
						<td>复制</td>
					</tr>
					
					<c:forEach begin="0"
						end="${effectTimeGroup.effectTimeList[0].section-1}" var="i">
						<tr align="center">
							<td>${effectTimeGroup.effectTimeList[0].showArray[i]}<!-- 006【14日08时-14日14时】 --></td>
							<td><div class="drop" code="codeType14">
									<select name="city6HoursList[${i}].weather">
										<c:forEach items="${codeTypeList}" var="codeType">
											<c:if test="${codeType.id==14}">
												<c:forEach items="${codeType.codeList}" var="code">
													<option value="${code.id}">(${code.code})${code.name}</option>
												</c:forEach>
											</c:if>
										</c:forEach>
									</select>
								</div></td>
							<td>
								<div class="drop" code="codeType16">
									<!-- 最大风力 -->
									<select name="city6HoursList[${i}].maxWindVelocity">
										<c:forEach items="${codeTypeList}" var="codeType">
											<c:if test="${codeType.id==16}">
												<c:forEach items="${codeType.codeList}" var="code">
													<option value="${code.id}">(${code.code})${code.name}</option>
												</c:forEach>
											</c:if>
										</c:forEach>
									</select>
								</div>
							</td>
							<td>
								<div class="drop" code="codeType15">
									<!-- 盛行风向 -->
									<select name="city6HoursList[${i}].prevailingWind">
										<c:forEach items="${codeTypeList}" var="codeType">
											<c:if test="${codeType.id==15}">
												<c:forEach items="${codeType.codeList}" var="code">
													<option value="${code.id}">(${code.code})${code.name}</option>
												</c:forEach>
											</c:if>
										</c:forEach>
									</select>
								</div>
							</td>
							<td>
								<!-- 最高 --> <input type="text"
								name="city6HoursList[${i}].maxTemp" size="5" />
							</td>
							<td>
								<!-- 最低 --> <input type="text"
								name="city6HoursList[${i}].minTemp" size="5" />
							</td>
							<td>
								<!-- 降水量  --> <input type="text"
								name="city6HoursList[${i}].precipitation" size="6" />
							</td>
							<td><c:if test="${i!=3}">
									<a href="javascript:void(0)" class="copyLink"> <img
										src="<c:url value="/resources/images/row_copy.png"/>">
									</a>
								</c:if> <c:if test="${i==3}">
									<a href="javascript:void(0)" class="copyLink"
										style="display: none"> <img
										src="<c:url value="/resources/images/row_copy.png"/>">
									</a>
								</c:if></td>
						</tr>
					</c:forEach>

				</table>
				<!--tab开始-->
				<div id="tab">
					<div class="menu1box">
						<ul id="menu1">
							<li class="hover" onmouseover="setTab(1,0)"><a href="#">鄞州气象台</a></li>
							<li onmouseover="setTab(1,1)"><a href="#">省气象台</a></li>
							<li onmouseover="setTab(1,2)"><a href="#">省气象台杭州</a></li>
						</ul>
					</div>
					<div class="main1box">
						<div class="main" id="main1">
							<ul class="block">
								<li>
									<!-- 鄞州气象台数据-->
									<table border="0" class="ck_table">
										<tr class="white">
											<td colspan="6"></td>
										</tr>
										<tr height="28">
											<th width="15%">预报时段(6h)</th>
											<th>天气</th>
											<th>风速</th>
											<th>风向</th>
											<th>温度</th>
											<th>降水</th>

										</tr>
										<tr class="white">
											<td colspan="6"></td>
										</tr>
										<tr class="normal_tr">
											<td>14日14时～20时</td>
											<td></td>
											<td></td>
											<td></td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
										</tr>
										<tr class="white">
											<td colspan="6"></td>
										</tr>
										<tr class="normal_tr">
											<td>14日20时～15日2时</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
										</tr>
										<tr class="white">
											<td colspan="6"></td>
										</tr>
										<tr class="normal_tr">
											<td>15日2时～8时</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
										</tr>
										<tr class="white">
											<td colspan="6"></td>
										</tr>
										<tr class="normal_tr">
											<td>15日8时～14时</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
										</tr>
										<tr class="white">
											<td colspan="6"></td>
										</tr>
										<tr class="normal_tr">
											<td>15日8时～14时</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
										</tr>
									</table>
								</li>
							</ul>
							<ul>
								<li>
									<!-- 省气象台数据-->
									<table width="100%" border="0">
										<tr>
											<th>预报时段(6h)</th>
											<th>天气</th>
											<th>风速</th>
											<th>风向</th>
											<th>温度</th>
											<th>降水</th>
										</tr>
										<tr>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
										</tr>
										<tr>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
										</tr>
										<tr>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
										</tr>
										<tr>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
										</tr>
										<tr>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
										</tr>
									</table>

								</li>
							</ul>
							<ul>
								<li>
									<!-- 省气象台杭州数据-->
									<table width="100%" border="0">
										<tr>
											<th>预报时段(6h)</th>
											<th>天气</th>
											<th>风速</th>
											<th>风向</th>
											<th>温度</th>
											<th>降水</th>
										</tr>
										<tr>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
										</tr>
										<tr>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
										</tr>
										<tr>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
										</tr>
										<tr>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
										</tr>
										<tr>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
											<td>&nbsp;</td>
										</tr>
									</table>
								</li>
							</ul>
						</div>
					</div>
				</div>
				<!--tab end-->
			</div>
			<!--start-->
			<div class="right_tb">
				<table width="100%" border="1" align="left" class="form_table">
					<tr>
						<td class="bgcolor"><p
								class="reportTitle forecast-font-color">报文内容</p></td>
					</tr>
					<tr height="325px">
						<td><div style="line-height: 20px;">
								<div>ZCZC</div>
								<div>FSCI50 BENB 140830</div>
								<div>2013011412时宁波6小时精细化预报</div>
								<div>SPCC6H 2013011412</div>
								<div>621 622 623 624 625 626</div>
								<div>58562 121.55 29.78 6.2 4</div>
								<div>006 0 5.0 2.0 0 0 999.9</div>
								<div>012 0 4.0 1.0 0 0 999.9</div>
								<div>018 0 12.0 4.0 0 0 999.9</div>
								<div>024 1 12.0 5.0 0 0 999.9</div>
								NNNN
							</div></td>
					</tr>
					<tr>
						<td style="background: #DCF2F8;" class="forecast-font-color">签&nbsp;&nbsp;&nbsp;&nbsp;名</td>
					</tr>
					<tr>
						<td><span class="forecast-font-color">首席：</span><select></select></td>
					</tr>
					<tr>
						<td class="bgcolor"><span class="forecast-font-color">主班：</span><select></select></td>
					</tr>
				</table>
			</div>
			<!--end-->
			<p style="text-align: center">
				<input type="button" value="保存" id="saveBtn" /><input type="button"
					value="发布" /><input type="button" value="复原" />
			</p>
		</form:form>
	</div>
	<!-- //end .center -->
	<jsp:include page="./menuWithDrag.jsp"></jsp:include>
</body>
</html>
